<template>
	<div class="myGrowth">
		<div class="classIndex_h">
			<span>我的成绩</span>
		</div>
		<!--  -->
		<div class="classNotice_search clear">
			<div class="achievement_type fl">
				<router-link to="/learn/grade/index">
					我的成绩
				</router-link>
				<router-link to="/learn/grade/growth">
					我的成长
				</router-link>
			</div>
		</div>
		<!--  -->
		<div class="myGrowth-chart" v-if="option.xAxis[0].data.length !== 0">
			<chart :options="option" ref="score"></chart>
		</div>
		<!--  -->
		<div class="myGrowth-tabel" v-if="ahievement2.length !== 0">
			<template>
				<el-table border :data="ahievement2" style="width: 100%">
					<el-table-column prop="name" label="名称" width="">
					</el-table-column>
					<el-table-column prop="sum" label="总分" align="center" width="100">
					</el-table-column>
					<el-table-column prop="average" align="center" label="班级平均分" width="100">
					</el-table-column>
					<el-table-column prop="rank" align="center" label="班级排名" width="100">
					</el-table-column>
				</el-table>
			</template>
		</div>
		<div class="dependent" v-if="ahievement2.length == 0 && option.xAxis[0].data.length === 0">
			<i class="ipm image_nofound"></i>
			<p>
				还没发现任何相关的内容哦~
			</p>
		</div>
	</div>
</template>
<script>
export default {
	data() {
		return {
			path: this.$route.query.id,
			region: '',
			subject_id: '',
			orgSubject: [],

			ahievement: [],
			ahievement2: [],
			option: {
				tooltip: {
					trigger: 'axis',
				},
				toolbox: {
					show: true,
					feature: {
						saveAsImage: {
							pixelRatio: 5
						}
					}
				},
				dataZoom: [{
						start: 0,
						end: 80,
					},
					{
						type: 'inside'
					}
				],
				legend: {
					y: '0',
					x: 'center',
					data: [],
				},
				toolbox: {
					show: true,
				},
				xAxis: [{
					type: 'category',
					data: []
				}],
				yAxis: [{
						type: 'value',
						name: '',
						splitNumber: 8,
						axisLabel: {
							formatter: function(value, index) {
								return value;
							}
						}
					},
					{
						type: 'value',
						name: '',
						min: 0,
						max: 30,
						interval: 5,
					}
				],
				series: []
			},
		}
	},
	watch: {

	},
	created() {
		this.getAhievement()
	},
	methods: {
		//获取科目
		getAhievement() {
			let success = res => {
				let data = res.data;
				this.ahievement = data.series;
				for (let i = 0; i < this.ahievement.length; i++) {
					this.option.series.push({
						name: this.ahievement[i].name,
						type: 'line',
						label: {
							normal: {
								show: true,
								position: 'top',
								formatter: '{c}'
							}
						},
						data: this.ahievement[i].data
					})
				}
				this.option.xAxis[0].data = data.testname
				this.option.legend.data = data.term

				for (let i = 0; i < data.testname.length; i++) {

					this.ahievement2.push({ name: data.testname[i] })
					this.ahievement2[i].sum = data.series[0].data[i]
					this.ahievement2[i].average = data.series[1].data[i]
					this.ahievement2[i].rank = data.series[2].data[i]
				}
			};
			this.$ajax({
				url: "api/statistics/student_grade_static_list",
				method: "get",
				params: {
					studentid: this.$g.user_id,
					classid: this.path,
					order: 'time',
					falg: 1
				},
				func: {
					success: success
				}
			});
		},
	}
}
</script>